<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
<!--    外部样式-->
    <link rel="stylesheet" href="../CSS/style.css">
<!--    <style>-->
<!--        外部导入式-->
<!--        @import url("../CSS/style.CSS");-->
<!--    </style>-->
</head>
<body>
  <h1>我是标题</h1>
  <h3 style="color: gray">行内样式优先级:就近原则(行内>内部>外部)</h3>
  <p class="cls" class="active">类选择器</p>
  <p id="ele">ID 选择器</p>
  <ul>
    <li><p>p1</p></li>
    <li><p>p2</p></li>
    <li><p>p3</p></li>
    <li><p>p4</p></li>
    <li><p>p5</p></li>
    <li><p>p6</p></li>
  </ul>
  <a href="#">link</a>
  <div class="transition"></div>
  <div id="box">
    <h2>会员登陆</h2>
    <form action="#">
      <div>
        <span>用户名: </span>
        <input type="text">
      </div>
      <div>
        <span>密码: </span>
        <input type="text">
      </div>
      <div>
        <span>邮箱: </span>
        <input type="text">
      </div>
    </form>
  </div>
</body>
</html>
